
$(function () {
    getHotSearchList();
    getLatelySearch();
    $(".back-wrapper").click(function () {
        location.href = "../index.html?channel=" + getQueryString("channel");
    });

    $(".clear-icon").click(function () {
        $(".book-name").val("");
        $(this).hide();
        $(".lately-search-wrapper").show();
        $(".hot-search-wrapper").show();
        $(".result-wrapper").hide();
        $(".no-more").hide();
    });

    $(".search-btn").click(function () {
        var bookName = $(".book-name").val().replace(/^\s+|\s+$/gm,'');
        if(bookName != ""){
            searchBook(bookName);
        }
    });

    $(".lately-search-list").on("click","li",function () {
        var bookName = $(this).html();
        $(".book-name").val(bookName);
        $(".clear-icon").show();
        searchBook(bookName);
    });

    $(".hot-search-list").on("click","li",function () {
        var bookName = $(this).children(".hot-name").html();
        $(".book-name").val(bookName);
        $(".clear-icon").show();
        searchBook(bookName);
    });

});

function showClear() {
    var bookName = $(".book-name").val().replace(/^\s+|\s+$/gm,'');
    if(bookName != ""){
        $(".clear-icon").show();
    }else{
        $(".clear-icon").hide();
    }
}

function searchBook(name) {
    $.ajax({
        type:'get',
        url:BASE_URl + "search/book?name="+name+"&format=full",
        success:function (data) {
            if(data.success){
                // 将搜索记录存到localstorage里
                saveLatelySearch(name);
                if(data.data){
                    // 显示搜索结果
                    $(".no-more").show();
                    showResult(data.data);
                }else{
                    Toast("查询结果为空");
                }
            }
        }
    });
}

function getHotSearchList() {
    $.ajax({
        type:'get',
        url:BASE_URl + "config/search?size=8",
        success:function (data) {
            if(data.success){
                DrawHotSearchList(data.data);
            }
        }
    });
}

function DrawHotSearchList(data) {
    var html = "";
    for(var i = 0;i < data.length;i ++){
        html += `<li class="inline"><span class="order inline">${i+1}</span><span class="inline hot-name">${data[i]}</span></li>`;
    }
    $(".hot-search-list").html(html);
}

function getLatelySearch() {
    var list = localStorage.getItem("bookName");
    if(!list){
        $(".lately-search-wrapper").hide();
    }else{
        list = list.split("|").reverse().splice(0,5);
        var html = "";
        for(var i = 0;i < list.length;i ++){
            html += `<li class="inline">${list[i]}</li>`;
        }

        $(".lately-search-list").html(html);
        $(".lately-search-wrapper").show();
    }
}

function saveLatelySearch(name) {
    var list = localStorage.getItem("bookName");
    if(!list){
        localStorage.setItem("bookName",name);
    }else{
        // 判断是否storage里是否已经存储
        var arr = list.split("|");
        var index = -1;
        for(var i = 0;i < arr.length;i ++){
            if(arr[i] == name){
                index = i;
                break;
            }
        }
        if(index == 0){
            list = list.replace(name + "|","");
            console.log(list);
        }else{
            list = list.replace("|" + name,"");
        }
        list = list + "|" + name;
        localStorage.setItem("bookName",list);
    }
    getLatelySearch();
}

function showResult(data) {
    $(".lately-search-wrapper").hide();
    $(".hot-search-wrapper").hide();

    var html = "";
    for (var i = 0;i < data.length;i ++){
        var statusHtml = "";
        if(data[i].status == "连载中"){
            statusHtml = `<span class="status updating">[${data[i].status}]：</span>`
        }else if(data[i].status == "已完结"){
            statusHtml = `<span class="status finish">[${data[i].status}]：</span>`
        }
        html += `<li onclick="goDetail('${data[i].id}')">
                    <div class="book-cover inline"><img src="${data[i].image}" alt="" width="100%" height="100%"></div>
                    <div class="book-detail inline">
                        <div class="book-name">${data[i].name}</div>
                        <div class="book-desc">
                            ` + statusHtml + `${data[i].desc}
                        </div>
                        <div class="cat-and-click clearfix">
                            <div class="cat-wrapper fl">
                                <span class="border-1px-all">${data[i].cat}</span>
                            </div>
                            <div class="click-wrapper fr">
                                <i class="inline click-icon"></i><span class="inline click">${data[i].clicks}</span>
                            </div>
                        </div>
                    </div>
               </li>`;
    }
    $(".result-wrapper ul").html(html);
    $(".result-wrapper").show();
}

function goDetail(id) {
    location.href = "./detail.html?id=" + id + "&channel=" + getQueryString("channel");
}